<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	>


<h:head>
<link rel="stylesheet" type="text/css" href="css/estilo.css"> </link>
<script type="text/javascript">
		//setInterval

		var cronometro;
		function detenerse()
		{
			clearInterval(cronometro);
		}

		function carga()
		{
			contador_s = 0;
			contador_m = 60;
			s = document.getElementById("segundos");
			m = document.getElementById("minutos");
			cronometro = setInterval(

			function() {

				if (contador_s == 0 )
				{
					if(contador_m!=0)
					{
						contador_m--;
						contador_s = 60;
						m.innerHTML = contador_m;
					}
					else if (contador_m == 0 )
					{
						contador_m = 0;
						redireccionar();
					}
				}

				
				s.innerHTML = contador_s;
				contador_s--;
			}
			, 1000);
		}

		function redireccionar() 
		{
		location.href="index.xhtml";
		} 
		//setTimeout ("redireccionar()", 20000);

	</script>

</h:head>
<!-- <h:body onload="carga()"> -->
<h:body onload="carga()">
<div class = "body">
	<p style="background: none; color: Red; font: bold 30px monospace; textaling:center;">
		<span id="minutos">0</span>:<span id="segundos">0</span>
	</p>
	<h:form id="form">
        <p:panel header="Cabecera" style="text-align:center">
        	<f:facet name="header">
        	<p:commandButton title="Siguiente Pregunta" update=":form" value="Anterior"
        					actionListener="#{preguntasView.preguntaAnterior}"
							style=" height:28px; background:none; border:none; float:left;"
							icon="ui-icon-circle-arrow-w" />
							
        	 <h:outputText value="PREGUNTA: #{(preguntasView.indexPregunta)+1} / #{preguntasView.obtenerTotalPreguntas()}" />
	            <p:commandButton title="Siguiente Pregunta" update=":form" value="Siguiente" 
	            			actionListener="#{preguntasView.preguntaSiguiente}"
							style="height:28px; background:none; border:none; float:right;"
							icon="ui-icon-circle-arrow-e" />
	        </f:facet>
            
            <h:outputText value="#{preguntasView.preguntaSeleccionada.pregunta}" />
            
            <p:selectOneRadio id="respuestas"  layout="grid" columns="1" value="#{preguntasView.seleccionada}">
			           <f:selectItems value="#{preguntasView.preguntaSeleccionada.respuestas}" var="c" itemLabel="#{c}"
			            itemValue="#{seleccionada}" itemDisabled="#{c eq preguntasView.obtenerSeleccionada() }"/> 
			           
			</p:selectOneRadio>
            
        </p:panel>

    
   
    <p:growl id="growl" life="3500" />
     
    <p:commandButton title="Finalizar" update="pantallaResultado" value="Terminar Examen"
	            			actionListener="#{preguntasView.calificarExamen}"
							style="float:right;"
							icon="ui-icon-star" oncomplete="PF('dlg').show()"/>
							
	<p:dialog modal="true" closable="false" resizable="false" widgetVar="dlg" header="Values" showEffect="clip">
        <p:panelGrid columns="2" id="pantallaResultado" columnClasses="label,value">
            <h:outputText value="Preguntas Respondidas:" />
            <h:outputText value="#{preguntasView.contestadas}" />
 
            <h:outputText value="Total de Preguntas:" />
            <h:outputText value="#{preguntasView.totalPreguntas}" />
            
            <h:outputText value="Correctas:" />
            <h:outputText value="#{preguntasView.correctas}" />
            
            <!-- <p:commandButton title="OK" oncomplete="PF('dlg').hide()" 
							style="height:28px; background:none; border:none; float:right;"
							icon="ui-icon-circle-arrow-e" />
							 -->							 
			<p:button outcome="index.xhtml" value="Salir" icon="ui-icon-circle-arrow-e">
			</p:button>
							 
 
        </p:panelGrid>
    </p:dialog>
    

</h:form>

</div>	

</h:body>
</html>
